<template>
	<scroll-view :style="{ height }" scroll-y :scroll-top="scrollTop" enable-back-to-top
		:refresher-triggered="isTriggered" :refresher-enabled="true" @refresherrefresh="refresherrefresh"
		@scrolltolower="scrolltolower" @scroll="scroll">
		<slot></slot>
		<up-loadmore :status="isXiaLa?'loading':'nomore'" loading-text="加载中" loadmore-text="没有更多了"
			:customStyle="{paddingBottom:'100rpx'}" />
	</scroll-view>
</template>

<script setup>
	const props = defineProps({
		height: {
			type: String,
			default: '93.9vh',
		},
		isTriggered: {
			type: Boolean,
			default: false
		},
		isXiaLa: {
			type: Boolean,
			default: false
		}
	});
	const scrollTop = ref(0)
	const oldScrollTop = ref(0)

	const emit = defineEmits(['scrolltolower', 'refresherrefresh']);
	const scrolltolower = () => {
		emit('scrolltolower', '上拉了');
	};
	const goTop=(e)=> {

		//视图会发生重新渲染
		scrollTop.value = oldScrollTop.value
		//当视图渲染结束 重新设置为0
		
		nextTick(() => {
			scrollTop.value = 0
		});
	}
	const scroll = (e) => {
	
		oldScrollTop.value = e.detail.scrollTop

	};
	const refresherrefresh = () => {
		emit('refresherrefresh', '下拉了');
	};
	defineExpose({
		goTop
	})
</script>

<style></style>